<template>
  <!--  转资产列表-->
  <div>
    <!--    :labelCol="({span:0})"-->
    <!--    :wrapperCol="({span:24})"-->

    <a-card :bordered="false">
      <b-table
          ref="table"
          class="m-table"
          :showPage="false"
          :scroll="{x: 1500, y: 'calc(50vh)' }"
          size="default"
          :selectConfig="{use: true, type: 'checkbox',rowKey: 'index' }"
          :out-selected-row-keys.sync="outSelectedRowKeys"
          :rowKey="record => record.id"
          :columns="_tabColumnsImport"
          :request="loadData"
      >
        <span slot="serial" slot-scope="text, record, index">{{ index + 1 }}</span>


        <template
            slot="assetNature"
            slot-scope="key, record"
        >
          {{ mapAssetNature(key) }}
        </template>
        <!-- 按钮-->
        <a-popconfirm
            slot="prefix"
            :title="'确定要去除'+outSelectedRowKeys.length + '条数据吗?'" @confirm="() => handleRemove()">

          <a-button
              type="primary"
              :disabled="outSelectedRowKeys.length == 0">去除
          </a-button>
        </a-popconfirm>
        <!--  footer-->
        <a-form-model ref="form" :model="form" :rules="rules" class="importCom" slot="footer" layout="inline">
          <a-row type="flex" justify="space-around">
            <a-col span="6">
              <a-form-model-item style="width:100%" label="验收单" prop="fileInfos" :labelCol="{style: 'width: 60px'}"
                                 :wrapperCol="{style: 'width: 150px'}">
                <l-table count="1"
                         :upload-arrys.sync="form.checkFile"
                         business-code="AM02"/>
              </a-form-model-item>
            </a-col>
            <a-col span="5">
              <a-form-model-item prop="enterTime"
                                 label="进场时间"
                                 style="width:100%"
                                 :labelCol="{style: 'width: fit-content'}"
                                 :wrapperCol="{style: 'width: 130px'}">
                <a-date-picker v-model="form.enterTime" format="YYYY-MM-DD" value-format="YYYY-MM-DD 00:00:00"
                               autocomplete="off"
                               placeholder="默认当前时间"/>
              </a-form-model-item>
            </a-col>
            <a-col span="5">
              <a-form-model-item prop="assetType" label="资产类别"
                                 style="width:100%"
                                 :labelCol="{style: 'width: 80px'}"
                                 :wrapperCol="{style: 'width: 130px'}">
                <a-select v-model="form.assetType" placeholder="默认为智慧展厅设备">
                  <a-select-option v-for="item in assetCatalogue" :value="item.value" :key="item.key">
                    {{ item.label }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col span="5">
              <a-form-model-item prop="keeperId" label="保管人"
                                 style="width:100%"
                                 :labelCol="{style: 'width: 60px'}"
                                 :wrapperCol="{style: 'width: 150px'}">
                <a-input-search v-model="form.keeperName" placeholder="默认为项目总工"
                                @click="()=> modal.visible = true"></a-input-search>
                <SelectPerson
                    title="选择保管人"
                    :visible.sync="modal.visible"
                    mode="single"
                    :need-data="modal.visible"
                    :org-id="modal.orgId"
                    :list.sync="modal.list"
                    @getSelectPerson="setSelectPerson($event)"
                />
              </a-form-model-item>
            </a-col>

            <a-col span="3">
              <a-form-model-item>
                <div style="display:flex;margin-top: 3px">
                  <a-button type="primary" @click="submit" :loading="loading">提交</a-button>
                  <a-button style="margin-left: 10px" @click="cancel">取消</a-button>
                </div>
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </b-table>

    </a-card>
  </div>
</template>

<script>
import {assetCatalogue, mapAssetNature, tabColumnsImport} from "../model.js";
import SelectPerson from "@/components/Select/SelectPerson.vue";
import {transform,getKeeperInfo} from "@/api/material/assets/assetManage";
import moment from "moment";

export default {
  name: 'AssetTransform',
  components: {SelectPerson},
  data() {
    return {
      tabColumnsImport,
      assetCatalogue,
      loading: false,
      outSelectedRowKeys: [],
      tableData: [],
      projectInfo: {},
      form: {
        checkFile: [],
        assetType: '0',
        keeperId: undefined,
        keeperName: undefined,
        keeperPhone: undefined,
        enterTime: this.formatTime2(new Date()),
      },
      modal: {
        visible: false,
        orgId: '06bcbdacb4374523bdaf66586c45f749',
        list: []
      },
      rules: {
        checkFile: [{required: true, message: '请验收单', trigger: 'blur'}],
      },
      loadData: (parameter) => {
        return {
          code: 200,
          data: this.tableData || [],
          totalSize: this.tableData?.length || 0,
        }
      },
    }
  },
  methods: {
    formatTime2(time) {
      return time ? moment(time).format('YYYY-MM-DD HH:mm:ss') : '-'
    },
    mapAssetNature,
    handleRemove() {
      //删除的时候原始数据和搜索数据集都要删除相应的数据
      this.tableData = this.unshift(this.tableData)
      this.$refs.table.refresh(true)
    },

    unshift(arr) { //剔除要删除的item
      let res = []
      for (let i = 0, len = arr.length; i < len; i++) {
        if (!this.outSelectedRowKeys.includes(arr[i].id)) {
          res.push(arr[i])
        }
      }
      return res
    },

    submit() {
      this.$refs.form.validate((valid, values) => {
        if (!valid) return
        if (this.form.checkFile.length <= 0) {
          this.$message.warning('请上传验收单!')
          return
        }
        let {name, phone, userId, employeeId} = {}
        let param = {
          enterTime: this.form.enterTime,
          assetType: this.form.assetType,

          keeperId: this.form.keeperId,
          keeperName: this.form.keeperName,
          keeperPhone: this.form.keeperPhone,

          list: this.tableData,
          info: this.projectInfo,
          fileList: this.form.checkFile.map(item => item.commonId)
        }

        this.loading = true
        transform(param).then((res) => {
          this.loading = false
          if (res.code === '0') {
            this.$message.success("转资产成功!")
            this.cancel()
          }
        }).catch((e) => {
          this.loading = false

        })
      })
    },
    cancel() {
      this.$multiTab.closeIframe(this.$route.path)
    },
    setSelectPerson(selected) {
      let selectPerson = selected[0]
      this.form.keeperId = selectPerson.userId
      this.form.keeperName = selectPerson.name
      this.form.keeperPhone = selectPerson.phone
    }
  },
  activated() {
    this.tableData = this.$route.params.list || this.tableData
    this.projectInfo = this.$route.params.info || this.projectInfo
    if (this.$route.params.list) {
      this.$refs.table.refresh(true)
    }
    if(this.projectInfo.projectId){
      getKeeperInfo({projectId: this.projectInfo.projectId })
          .then(res=>{
            console.log('总工信息=', res)
            if (res.code === '0' && res.data.length > 0) {
              let p = res.data[0]
              if(p){
                this.form.keeperId = p.id
                this.form.keeperPhone = p.phone
                this.form.keeperName = p.userName
              }
            }
          })
    }
  },
  computed: {
    _tabColumnsImport() {
      return this.tabColumnsImport.filter((item) => item.title !== '操作')
    }
  }
}

</script>


<style scoped lang="less">

.importCom /deep/ .ant-form-item-label {
  text-align: left;
}

.importCom /deep/ .ant-upload-list {
  float: right;
}
</style>